<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../js/common.js"></script>
    <script src="../js/cookie.js"></script>
    <script src="../js/jquery-3.6.0.min.js"></script>
    <script src="../js/ajax.js"></script>
    <script src="../js/api.js"></script>
    <style>
        .rt {
            color: green;
            font-size: 12px;
        }

        .err {
            color: red;
            font-size: 12px;
        }
    </style>
</head>

<body>
    <form onsubmit="return false">
        <p>
            <label for="">用户名:</label>
            <input id="user" type="text">
            <span id="user_tips"></span>
        </p>
        <p>
            <label for="">密&emsp;码:</label>
            <input id="pwd" type="text">
            <span id="pwd_tips"></span>
        </p>
        <p><input id="btn" type="submit" value="登录"></p>
    </form>
</body>
<script>

    var userInp = document.getElementById("user");
    var userTips = document.getElementById("user_tips");

    var pwdInp = document.getElementById("pwd");
    var pwdTips = document.getElementById("pwd_tips");

    var btn = document.getElementById("btn");

    // 模拟注册
    // 登录时 要求判断是否登录成功
    // cookie中存的   ,  用户输入的
    btn.onclick = function () {
        // 用户输入的
        var user = userInp.value;
        var pwd = pwdInp.value;

        if (user && pwd) {
            // var xhr = new XMLHttpRequest();

            // xhr.open("post", "../php/login.php", true);

            // xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            // xhr.send(`user=${user}&pwd=${pwd}`);

            // xhr.onreadystatechange = function () {
            //     if (xhr.readyState == 4 && xhr.status == 200) {
            //         var result = JSON.parse(xhr.responseText);
            //         console.log(result);
            //         var { status, detail } = result;
            //         if (status) {
            //             setCookie("lgc", user, 31);
            //             location.href = "./index1.html";
            //         } else {
            //             alert(detail);
            //         }
            //     }
            // }

            // ajax({
            //     type: "post",
            //     url: "../php/login.php",
            //     // data: "user=" + user,
            //     data: {
            //         user,
            //         pwd,
            //     },
            //     dataType: "json",
            //     success: function (result) {
            //         console.log(result);
            //         var { status, detail } = result;
            //         if (status) {
            //             setCookie("lgc", user, 31);
            //             location.href = "./index1.html";
            //         } else {
            //             alert(detail);
            //         }
            //     }
            // })

            login({ user, pwd }).then(result => {
                console.log(result);
                var { status, detail } = result;
                if (status) {
                    setCookie("lgc", user, 31);

                    var search = location.search;
                    var returnUrl = search.split('=')[1];
                    if (returnUrl) { //有参数  => 回去
                        location.href = decodeURIComponent(returnUrl)
                    } else {
                        location.href = "./index.html";
                    }

                } else {
                    alert(detail);
                }
            }).catch(err => {
                throw err;
            })
        }

    }


</script>

</html>